<!DOCTYPE html>
<html>
<head lang="zh">
    <meta charset="UTF-8">
    <title>登录页设置列表</title>
<#include "admin/common.ftl"/>
<#include "admin/permission.ftl"/>
    <style type="text/css">
        img{height: 100px;margin: 6px auto;position: relative;top: 3px;}
    </style>
</head>
<body>
<#--工具栏-->
<div id="tb">
    <table cellpadding="0" cellspacing="0">
        <tr>
        <#if hasAdd == "true"><td><a class="easyui-linkbutton" onclick="add()" data-options="iconCls:'icon-ehome-standard-add', plain: true">添加</a></td></#if>
        <#if hasDel == "true"><td><a class="easyui-linkbutton" onclick="del()" data-options="iconCls:'icon-ehome-standard-delete', plain: true">删除</a></td></#if>
        <#if hasUpdate == "true"><td><a class="easyui-linkbutton" onclick="edit()" data-options="iconCls:'icon-ehome-standard-edit', plain: true">编辑</a></td></#if>
            <td><div class="datagrid-btn-separator"></div></td>
            <td><a class="easyui-linkbutton" onclick="reloadGrid()" data-options="iconCls:'icon-ehome-standard-refresh', plain: true">刷新</a></td>
        <#if hasAvailable == "true"><td><a class="easyui-linkbutton" onclick="doEnable()" data-options="iconCls:'icon-ehome-standard-enable', plain: true">启用</a></td></#if>
        <#if hasUnavailable == "true"><td><a class="easyui-linkbutton" onclick="doDisabled()" data-options="iconCls:'icon-ehome-standard-disabled', plain: true">禁用</a></td></#if>
        </tr>
    </table>
</div>

<div class="easyui-datagrid" id="datagrid"></div>

<script type="text/javascript">
    var datagrid = $("#datagrid");
    $(function () {
        list();
    });

    // 加载数据
    function list() {
        datagrid.datagrid({
        <#if hasQuery == 'true'>
            url: "${base}/admin/loginpage/list",
        </#if>
            idField: "id",
            toolbar: "#tb",
            remoteSort: false,
            multiSort: false,
            rownumbers: true,
            singleSelect: false,
            ctrlSelect:true,
            animate: true,
            fit: true,
            border:false,
            pagination:true,
            pageSize: 20,
            pageList: [20,40,60],
        <#if hasUpdate == 'true'>
            onDblClickRow: edit,
        </#if>
            columns: [[
                {field: "id", title: "主键", width: 100, sortable: true},
                {field: "backgroundImage", title: "背景图片", width: 380, formatter: formatBgImage},
                {field: "backgroundColor", title: "背景颜色值", width: 80, formatter: formatColor},
                {field: "status", title: "状态", width: 80, sortable: true, formatter: formatStatus},
                {field: "description", title: "描述", width: 380}
            ]]
        });
    }

    <#if hasAdd == 'true'>
    // 添加
    function add() {
        layer.open({
            title: "创建登录页设置",
            type: 2,
            area: ["650px", "450px"],
            fix: false, //不固定
            shadeClose: false,
            zIndex: (new Date()).valueOf(),
            maxmin: true,
            content: "${base}/admin/loginpage/add"
        });
    }
    </#if>

    <#if hasUpdate == 'true'>
    // 修改
    function edit() {
        var selectedRow = datagrid.datagrid("getSelected");
        if (selectedRow != null) {
            layer.open({
                title: "修改设置信息[" + selectedRow.name + "]",
                type: 2,
                area: ["650px", "450px"],
                fix: false, //不固定
                shadeClose: false,
                zIndex: (new Date()).valueOf(),
                maxmin: true,
                content: "${base}/admin/loginpage/edit?id=" + selectedRow.id
            });
        } else {
            layer.open({
                title: "警告",
                content: "请选择一条要修改的数据！",
                icon: 0
            });
        }
    }
    </#if>

    <#if hasDel == 'true'>
    // 删除
    function del() {
        var selectedRow = datagrid.datagrid("getSelections");
        if (selectedRow != null && selectedRow.length > 0) {
            var ids = [];
            $.each(selectedRow, function (i, m) {
                ids.push(m.id);
            });
            var info = "你确认要删除";
            if (selectedRow.length > 1) {
                info += "这些选中的数据吗？"
            } else {
                info += "【" + selectedRow[0].id + "】吗？";
            }
            layer.confirm(info, {icon: 3, title: "友情提醒"}, function (index) {
                $.ajax({
                    type: "post",
                    url: "${base}/admin/loginpage/remove",
                    data: {ids: ids.join(",")},
                    dataType: "json",
                    success: function (result) {
                        var status = result.status;
                        if (status == "success") {
                            layer.msg(result.msg, {time: 2000, icon: 6});
                            reloadGrid();
                        } else {
                            layer.alert(result.msg, {title: "错误提示", icon: 2});
                        }
                    }
                });
            });
        } else {
            layer.open({
                title: "警告",
                content: "请选择一条要删除的数据！",
                icon: 0
            });
        }
    }
    </#if>

    <#if hasAvailable == 'true'>
    // 启用
    function doEnable() {
        var selectedRow = datagrid.datagrid("getSelections");
        if (selectedRow != null && selectedRow.length > 0) {
            var ids = [];
            $.each(selectedRow, function (i, m) {
                ids.push(m.id);
            });
            var info = "你确认要启用";
            if (selectedRow.length > 1) {
                info += "这些选中的数据吗？"
            } else {
                info += "【" + selectedRow[0].id + "】吗？";
            }
            layer.confirm(info, {icon: 3, title: "友情提醒"}, function (index) {
                $.ajax({
                    type: "post",
                    url: "${base}/admin/loginpage/enable",
                    data: {ids: ids.join(",")},
                    dataType: "json",
                    success: function (result) {
                        var status = result.status;
                        if (status == "success") {
                            layer.msg(result.msg, {time: 2000, icon: 6});
                            reloadGrid();
                        } else {
                            layer.alert(result.msg, {title: "错误提示", icon: 2});
                        }
                    }
                });
            });
        } else {
            layer.open({
                title: "警告",
                content: "请选择一条要启用的数据！",
                icon: 0
            });
        }
    }
    </#if>

    <#if hasUnavailable == 'true'>
    // 禁用
    function doDisabled() {
        var selectedRow = datagrid.datagrid("getSelections");
        if (selectedRow != null && selectedRow.length > 0) {
            var ids = [];
            $.each(selectedRow, function (i, m) {
                ids.push(m.id);
            });
            var info = "你确认要禁用";
            if (selectedRow.length > 1) {
                info += "这些选中的数据吗？"
            } else {
                info += "【" + selectedRow[0].id + "】吗？";
            }
            layer.confirm(info, {icon: 3, title: "友情提醒"}, function (index) {
                $.ajax({
                    type: "post",
                    url: "${base}/admin/loginpage/disable",
                    data: {ids: ids.join(",")},
                    dataType: "json",
                    success: function (result) {
                        var status = result.status;
                        if (status == "success") {
                            layer.msg(result.msg, {time: 2000, icon: 6});
                            reloadGrid();
                        } else {
                            layer.alert(result.msg, {title: "错误提示", icon: 2});
                        }
                    }
                });
            });
        } else {
            layer.open({
                title: "警告",
                content: "请选择一条要禁用的数据！",
                icon: 0
            });
        }
    }
    </#if>

    // 格式化背景图片
    function formatBgImage(val) {
        if (val != "") return "<img src='${base}/attached/image/" + val + "' height='100px'/>";
        else return "";
    }

    // 格式化背景颜色
    function formatColor(val) {
        return "<div style='height:26px;width:26px;background-color:" + val + "'></div>";
    }

    // 格式化状态
    function formatStatus(val, row, index) {
        if (val == "AVAILABLE") return "<div class='icon-ehome-standard-enable'>&nbsp;<div>";
        else if (val == "UNAVAILABLE") return "<div class='icon-ehome-standard-disabled'>&nbsp;<div>";
    }

    <#if hasRefresh == 'true'>
    // 刷新grid
    function reloadGrid() {
        datagrid.datagrid("reload");
        datagrid.datagrid("unselectAll");
    }
    </#if>
</script>
</body>
</html>